/* 
路由器对象
*/
import Vue from 'vue'
import VueRouter from 'vue-router'

// import Home from '@/views/Home'
// import Login from '@/views/Login'
// import Course from '@/views/Home/components/Course'
// import Game from '@/views/Home/components/Game'
// import News from '@/views/Home/components/News'
// import CourseItem from '@/views/Home/components/Course/Item'

/* 
懒加载: 请求对应的路径时才请求获取对应的打包文件

import动态引入的特点:
  单独打包(code split  代码分割): 被引入的模块会被单独打包
  单独打包是懒加载的前提
包含动态引入的函数: () => import('@/views/Home')
  开始不执行, 请求对应的路径时才会执行
  执行函数进才会请求加载对应的打包文件 

import静态引入:
  import xxx from '模块'
  会打包在一起
*/

const Home = () => import('@/views/Home')
const Login = () => import('@/views/Login')
const Course = () => import('@/views/Home/components/Course')
const News = () => import('@/views/Home/components/News')
const Game = () => import('@/views/Home/components/Game')
const CourseItem = () => import('@/views/Home/components/Course/Item')

// 安装插件
Vue.use(VueRouter)

// 创建路由器对象
const router = new VueRouter({
  // 路由表
  routes: [
    // 路由 path component
    {
      name: 'Login', 
      path: '/login', 
      component: Login,
      meta: {
        isHideFooter: true, // 标识隐藏footer
      }
    },
    {
      name: 'Home',
      path: '/home', 
      component: Home,
      // 写法2: 当访问/home时, 自动跳转到/home/course
      redirect: '/home/course',
      // 注册二级子路由
      children: [
        {name: 'News', path: '/home/news', component: News},
        {name: 'Game', path: 'game', component: Game},
        {
          name: 'Course2', 
          path: 'course', 
          component: Course,
          children: [
            {
              name: 'CourseItem', 
              // path: 'item/:id/:name',   // 必须要有冒号占位
              path: 'item/:id',   // 必须要有冒号占位
              component: CourseItem,
              // 对象: 专门指定自定义数据的
              // props: {a: 1, b: 2} 
              // 布尔值true: 专门用来传递params参数(将params参数映射成props传递)
              // props: true,
              // 函数形式: 可以自定义, query参数, params参数 => 最厉害的
              props: route => ({a: 1, id: route.params.id, name: route.query.name})
            }
          ]
        },
        // 写法一: 当访问/home时, 自动跳转到/home/course
        // {path: '', redirect: '/home/course'},

      ]
    },
    // 当请求项目根路径时, 自动跳转/login路由路径
    {
      path: '/',
      redirect: '/home'
    }
  ]
})


/* 通过重写VueRouter原型对象上的push/replace方法, 来解决重复跳转报错的问题 */
const originPush = VueRouter.prototype.push
VueRouter.prototype.push = function (location, onResolved, onRejected) {
  console.log('push', onResolved, onRejected)
  debugger
  // 如果传入了回调, 用的旧语法, 不会有错误的, 调用原函数进行处理
  if (onResolved || onRejected) {
    originPush.call(this, location, onResolved, onRejected)
  } else { // 没有传回调, 用的新语法, 可能会抛出失败的promise错误
    return originPush.call(this, location).catch(() => {
      console.log('error')
    })
    // originPush.call(this, () => {})
  }
}


// 暴露路由器
export default router
